<template>
  <div class="page moneyValidate">
    <div class="scroll-view">
      <customHeader middleTitle="开通确认"></customHeader>
      <fxActivityProtocol ref="fxActivityProtocol"></fxActivityProtocol>
      <div class="page-body">
        <div class="section">
          <div class="form-title">我们已经向您的对公账户打款了一笔小额验证款项，请查询银行收支明细填写</div>
          <ul class="form-style">
            <li>
              <span>银行账号</span>
              <div>{{queryParams.bankName}} {{CommonUtil.encryptionBankCardNo(bankCardNo)}}</div>
            </li>
            <li>
              <span>验证收款金额</span>
              <div>
                <inputClear
                  placeholder="请输入金额"
                  v-model="money"
                  warpClass="textright"
                  :maxlength="6"
                  :max="6"
                ></inputClear>
              </div>
            </li>
          </ul>
          <div class="protocol">
            <i :class="protocolChecked?'zhk-ty':'zhk-wxz'" @click="protocolCheck"></i>
            我已阅读同意
            <span class="link" @click="openProtocol()">《营销服务协议》</span>
            <span
              class="link"
              @click="linkToProtocol(validateData?validateData['signUrl']:'')"
            >《商户分账协议》</span>
          </div>
          <div class="btn-wrap">
            <div class="btn" :class="{disabled:!money||!protocolChecked}" @click="submit">提交</div>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import Vue from "vue";
import customHeader from "../../components/header/header";
import inputClear from "../../components/inputClear/inputClear";
import fxActivityProtocol from "../fxActivitySigning/fxActivityProtocol";
import { Toast, MessageBox } from "mint-ui";
import jsBridge from "../../tools/jsBridge.js";
export default {
  name: "moneyValidate",
  data() {
    return {
      CommonUtil: CommonUtil,
      queryParams: null,
      bankCardNo: "",
      validateData: null,
      money: "",
      protocolChecked: false,
    };
  },

  methods: {
    openProtocol() {
      this.$refs.fxActivityProtocol.popupShow();
    },
    linkToProtocol(url) {
      if (!url) {
        Toast("未取到协议地址");
      } else {
        jsBridge.openWindow({
          needTitle: true,
          url: url,
          target: "server",
        });
      }
    },
    protocolCheck() {
      this.protocolChecked = !this.protocolChecked;
    },
    submit() {
      if (!this.protocolChecked) {
        Toast("请先阅读并同意协议内容");
        return;
      }
      if (!this.money) {
        Toast("请输入金额");
        return;
      }

      const reg = /^(([1-9][0-9]*)|(([0]\.\d{1,2}|[1-9][0-9]*\.\d{1,2})))$/;//金额校验
      if (!reg.test(this.money)) {
        Toast("输入的收款金额错误");
        return;
      }
      this.updateMsgState();

    },
    //更改消息状态
    updateMsgState() {
      if(!this.validateData.contractNo){
         Toast("未获取到协议");
      }
      let param = {
        shopId: this.queryParams.shopId,
        msgId: this.queryParams.msgId,
        msgStatus: 1,//1：同意
        msgTitleType: this.queryParams.msgTitleType,
        openId: this.queryParams.openId,
        needOpenMarketing: this.queryParams.needOpenMarketing,
        marketActivityModel: {
          operate: "0",//0走富友 1直接改状态 
          status: this.queryParams.marketActivityModel.status,
          mchntAllowcateSignModel: {
            shopId: this.queryParams.shopId,
            merchantId: this.validateData.merchantId,
            accountType: this.queryParams.accountType,
            verifyNo: "",
            verifyAmt: this.money,
            contractNo: this.validateData.contractNo
          },
        },
      };
      this.ajax({
        url: "/newapp/AppMsg/updateMsgState.do",
        type: "post",
        data: param,
        controlLoading: true
      }).then(res => {
        if (res.success) {
          Toast({
            message: '处理成功',
            iconClass: 'icon icon-success'
          });
          if (this.queryParams.needOpenMarketing == 4) {
            //needOpenMarketing是否需要开通（变更）分账（新增） 0 不需要开通分账 1 支付宝商户号开通分账 2.微信商户号开通分账 3.同一商户号开通分账 4.不同商户号开通分账
            this.$router.back();
          } else {
            this.$router.go(-3);
          }

        } else {
          // 5002,"协议正在审核，请勿重复签署"
          // 5003,"协议编号无效，请重新申请"
          // 5000,"找不到要签署的协议，请重新申请"
          // 5005,"协议正在生效，请勿重复签署 "
          // 5004,"协议已注销，请重新申请"
          // 4001,"验证码已失效,请重新申请"
          // 4002,"已超过最大验证次数,请重新申请"
          // 4003,"协议编号异常，请确认协议编号"
          // 4004,"协议记录缺失,请重新申请"
          // 4000,"协议未生成,请先生成协议"
          const reTodo = res.code == 5003 || res.code == 5000 || res.code == 5004 || res.code == 4001 || res.code == 4004 || res.code == 4000 ? true : false;
          MessageBox({
            title: "提示",
            message: res.msg,
            showCancelButton: false,
            confirmButtonText: reTodo ? "重新生成" : "知道了",
            closeOnClickModal: true
          }).then(action => {
            if (action == "confirm") {
              //重新生成协议
              if (reTodo) {
                this.getMoneyCode();
              }
            }
          });
        }
      })
        .catch(err => {

        });
    },
    //发送校验金额
    getMoneyCode() {
      this.ajax({
        url: `/newapp/AppMsg/getMarketingOauthCode.do?payType=${this.queryParams.payType}&marketingId=${this.queryParams.openId}&shopId=${this.queryParams.shopId}&msgId=${this.queryParams.msgId}&phoneNumber=""`,
        type: "get",
        controlLoading: true
      })
        .then(result => {
          if (result.success.toString() == "true") {
            this.validateData = result.resultObject;
          } else {
            Toast(result.msg);
          }
        })
        .catch(err => {

        });
    },
    //是否已经生成协议,如果已经生成协议则不在调用getMarketingOauthCode.do
    hasProtocol() {
      this.ajax({
        url: `/newapp/AppMsg/allowcateAgreementCheck.do?merchantId=${this.queryParams.merchantId}`,
        type: "get",
        controlLoading: false
      })
        .then(result => {
          if (result.success.toString() == "false") {
            this.getMoneyCode();
          }
          else {
            if (result.resultObject && result.resultObject['contractNo']) {
              this.validateData = result.resultObject;
            } else {
              this.getMoneyCode();
            }
          }
        })
        .catch(err => {
          this.getMoneyCode();
        });
    }
  },
  created() {
    this.queryParams = this.$route.query;
    this.bankCardNo = this.$route.query.bankCardNo;
    this.hasProtocol();
  },
  components: {
    customHeader,
    inputClear,
    fxActivityProtocol
  },

};
</script>
<style lang='scss' scoped>
@import "fxActivitySigning";
</style>
<style lang='scss'>
.textright {
  text-align: right !important;
}
</style>
